import { createRouter, createWebHashHistory } from "vue-router"
import Home from "@/pages/Home.vue"
import News from "@/pages/News.vue"
import About from "@/pages/About.vue"
import Detail from "@/pages/Detail.vue"

// 1,路由组件通常存放在pages或views文件夹下,一般组件通常存放在components文件夹下
// 2,通过点击导航,视觉效果上"消失"了的路由组件,默认是被卸载(Unmounted)掉的,需要的时候再去挂载.
// 一般组件,程序员写出来的

const router = createRouter({
  history: createWebHashHistory(), // 路由器的工作模式
  routes: [
    {
      name: "nHome", // 路由规则名称
      path: "/home",
      component: Home, // 路由组件,由路由规则渲染出来的
    },
    {
      name: "nNews",
      path: "/news",
      component: News,
      children: [
        {
          name: "nDetail",
          path: "detail", // 子级路由的path不用写开头的斜杠
          component: Detail,
        },
      ],
    },
    {
      name: "nAbout",
      path: "/about",
      component: About,
    },
  ],
})

export default router
